{__NOLAYOUT__}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    {include file="public/script" /}
    <link rel="stylesheet" href="__STATIC__/chart/css/jquery.jOrgChart.css">
    <script src="__STATIC__/chart/js/jquery.js"></script>
    <script src="__STATIC__/chart/js/jquery.jOrgChart.js"></script>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        a {
            text-decoration: none;
            color: #000;
            font-size: 12px;
        }
        .jOrgChart .node {
            border-radius: 4px;
        }
        #jOrgChart{

        }
        #jOrgChart table{
            margin: 0 auto;
        }
    </style>

</head>
<body>
<div class="sectionH sectionH2 mui-clearfix">
    <header class="mui-bar mui-bar-nav" style="">
        <a class="mui-icon mui-icon-left-nav  mui-pull-left" href="javascript:history.back(-1)" style="color: #727272;"></a>
        <h1 class="mui-title">商会详情</h1>
        <!--<a class="mui-icon mui-pull-right right1" href="javascript:;" style="padding-top: 10px;"><img src="images/nav_icon_search.png"/></a>-->
    </header>
</div>
<div class="kong1"></div>
<div class="us_shanghui_section1">
    <div class="us_shanghui_section1_1">
        <div class="container">
            <img src="{$info.avatar}"/>
            <p class="p1">{$info.title}</p>
        </div>
    </div>
    <div class="us_shanghui_section1_2">
        <div class="container mui-clearfix">
            <ul>
                <li>
                    <p class="p1"><span>{$info.all_num}</span> 人</p>
                    <p class="p2">会员人数</p>
                    <!--<p class="p3"><span>2.5%</span> <img src="__STATIC__/www/images/mine_co_icon_up.png"/></p>-->
                </li>
                <li>
                    <p class="p1"><span>{$info.new_num}</span> 人</p>
                    <p class="p2">新增人数</p>
                    <!--<p class="p3"><span>2.5%</span> <img src="__STATIC__/www/images/mine_co_icon_up.png"/></p>-->
                </li>
                <li>
                    <p class="p1"><span>{$info.follow_num}</span> 人</p>
                    <p class="p2">被关注</p>
                    <!--<p class="p4"><span>2.5%</span> <img src="__STATIC__/www/images/mine_co_icon_down.png"/></p>-->
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="ge"></div>
<div class="us_shanghui_section2">
    <div class="us_shanghui_section2_1 mui-clearfix">
        <ul>
            <li class="select">商会领导</li>
            <li>组织架构</li>
            <li>商会简介</li>
        </ul>
    </div>
    <div class="us_shanghui_section2-1">
        <div class="us_shanghui_section2_2 select">
            <div class="container1">
                <ul class="mui-clearfix">
                    {volist name="$info.leader_arr" id="leader"}
                    <li class="ccv">
                        <a href="{:url('Bussiness/memberInfo',array('id'=>$leader.id))}">
                            <img src="{$leader.avatar|default='/static/default_avatar.png'}"/>
                            <p class="p1">{$leader.real_name}</p>
                            <p class="p2"><span>{$leader.title}</span></p>
                            <!--<p class="p3">临沂市市长</p>-->
                        </a>
                    </li>
                    {/volist}
                </ul>
                <p class="p1"><a href="{:url('Bussiness/leaderList',array('id'=>$info.id))}">查看更多</a></p>
            </div>
        </div>
        <div id="jOrgChart" class="us_shanghui_section2_2"></div>
        <div class="us_shanghui_section2_2">
            <div class="container1">
                {$info.detail}
            </div>
        </div>
    </div>

</div>
<div class="ge"></div>
<div class="us_shanghui_section3">
    <div class="us_shanghui_section3_1">
        <div class="container mui-clearfix">
            <p class="p1">商会会员</p>
            <a href="{:url('Bussiness/memberList',array('id'=>$info.id))}" class="a1">查看更多＞</a>
        </div>
    </div>
    <div class="us_shanghui_section3_2">
        <div class="container">
            <div class="items">
                {volist name="$info.member_arr" id="member"}
                <div class="items_1 mui-clearfix">
                    <a href="{:url('Bussiness/memberInfo',array('id'=>$member.id))}">
                        <div class="div1">
                            <img src="{$member.avatar|default='/static/default_avatar.png'}" alt="" />
                        </div>
                    </a>
                    <div class="div2">
                        <p class="p1"><span class="s1">{$member.real_name}</span> <span class="s2">{$member.title}</span></p>
                        <p class="p2" >{$member.mobile|hide_mobile}</p>
                    </div>
                    <div class="div3">
                        <a href="javascript:void(0);"><img src="__STATIC__/www/images/co_send_icon_message.png"/></a>
                    </div>
                </div>
                {/volist}
            </div>
        </div>
    </div>
</div>
</body>
<script>

</script>
<script type='text/javascript'>

    $(function(){
        //数据返回
        var id="{$bussiness_id}";
        $.ajax({
            url: "{:url('Connection/departmentChart')}",
            type: 'post',
            dataType: 'JSON',
            data: {id: id},
            success: function(result){
                result=JSON.parse(result);
                var showlist = $("<ul id='org' style='display:none'></ul>");
                showall(result.data, showlist);console.log(result);
                $("#jOrgChart").append(showlist);
                $("#org").jOrgChart( {
                    chartElement : '#jOrgChart',//指定在某个dom生成jorgchart
                    dragAndDrop : true //设置是否可拖动
                });

            }
        });
    });


    function showall(menu_list, parent) {
        $.each(menu_list, function(index, val) {
            if(val.childrens.length > 0){
                var li = $("<li></li>");
                li.append("<a href='javascript:void(0)' >"+val.name+"</a>").append("<ul></ul>").appendTo(parent);
                //递归显示
                showall(val.childrens, $(li).children().eq(1));
            }else{
                $("<li></li>").append("<a href='javascript:void(0)' >"+val.name+"</a>").appendTo(parent);
            }
        });

    }

</script>

</html>